<template>
  <div class="background">
    <a-card style="margin-bottom: 10px">
      <a-form
        :form="form"
        layout="inline"
        @submit="handleSubmit"
      >
            <a-form-item label="辅料编号">
              <a-input
              style="width:200px"
                allow-clear
                placeholder="请输入辅料编号"
                v-model="formContent.accCode"
              ></a-input>
            </a-form-item>
            <a-form-item label="辅料大类">
              <a-select
                style="width: 200px"
                placeholder="请选择辅料大类"
                v-model="formContent.accClassifyBig"
                @focus="getDictChildList('CLASSIFY_BIG', 'classifyBigList')"
                allow-clear
              >
                <a-select-option
                  :value="item.code"
                  v-for="(item, index) in classifyBigList"
                  :key="index"
                >
                  {{ item.name }}
                </a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item label="调样单编号">
              <a-input
                allow-clear
                style="width:200px"
                placeholder="请输入调样单编号"
                v-model="formContent.accRetrievalSampleCode"
              ></a-input>
            </a-form-item>
            <a-form-item label="调样单ID">
              <a-input
                allow-clear
                style="width:200px"
                placeholder="请输入调样单ID"
                v-model="formContent.accRetrievalSampleId"
              ></a-input>
            </a-form-item>
            <a-form-item label="状态">
              <a-select
                style="width: 300px"
                placeholder="请选择状态"
                mode="multiple"
                v-model="formContent.statusList"
                allow-clear
              >
                <a-select-option
                  :value="item.value"
                  v-for="(item, index) in statusList"
                  :key="index"
                >
                  {{ item.name }}
                </a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item>
              <a-button
                type="primary"
                html-type="submit"
              >搜索</a-button>
              <a-button
                type="primary"
                v-if="auth.includes('acc_r_s_apply_list_save')"
                style="margin-left: 10px"
                @click="add"
              >新建</a-button>
            </a-form-item>
      </a-form>

    </a-card>
    <a-card>
      <a-table
        bordered
        :loading="loading"
        :scroll="{x: 1500,y:500}"
        :pagination="pagination"
        :columns="columns"
        :data-source="dataSource"
        @change="handleTableChange"
      >
        <template
          slot="status"
          slot-scope="txt, record"
        >
          <span v-for="item,i in statusList" :key="i"> 
          <span v-if="item.value == record.status">
            {{ item.name }}
          </span></span>
        </template>
        <template
          slot="category"
          slot-scope="txt, record"
        >
          <span v-if="record.category == 10">调样</span>
          <span v-else>扩色</span>
        </template>
        
        <template
          slot="action"
          slot-scope="txt, record"
        >
          <a
            class="mr-10"
            @click="add(record)"
          >
            编辑
          </a>
          <a-popconfirm
            :title="`确定要删除该项吗?`"
            @confirm="deleteRecord(record)"
          >
          <a
            class="mr-10"
            v-if="auth.includes('acc_r_s_apply_list_delete')"
          >
            删除
          </a>
          </a-popconfirm>
        </template>
      </a-table>
    </a-card>

    <create
      v-if="showAdd"
      :accRetrievalSampleDetailId="accRetrievalSampleDetailId"
      @close="close"
    ></create>
  </div>

</template>
  
  <script>
import { retrievalsample, getDictChildList, retrievalsampleDelete, operation } from '@api/material/index'
import { postAction } from '@/api/manage'

const columns = [
  {
    title: '单据编号',
    width: 200,
    dataIndex: 'accRetrievalSampleCode',
    fixed: 'left'
  },
  {
    title: '货季',
    width: 180,
    dataIndex: 'goodsSeasonValue'
  },
  // {
  //   title: '辅料品类',
  //   width: 180,
  //   dataIndex: 'accName1'
  // },
  {
    title: '订单类别',
    width: 180,
    dataIndex: 'category',
    scopedSlots: { customRender: 'category' }

  },
  {
    title: '品牌',
    width: 150,
    dataIndex: 'brandValue'
  },
  {
    title: '供应商',
    width: 100,
    dataIndex: 'supplyName'
  },
  {
    title: '供应商编号',
    width: 150,
    dataIndex: 'supplyCode'
  },
  {
    title: '物料编号',
    width: 120,
    dataIndex: 'accCode'
  },
  {
    title: '物料代码',
    width: 200,
    dataIndex: 'accPriceCode'
  },
  {
    title: '物料名称',
    width: 120,
    dataIndex: 'accName'
  },
  {
    title: '规格',
    width: 100,
    dataIndex: 'materialSpecsName'
  },
  {
    title: '颜色',
    width: 100,
    dataIndex: 'materialColorName'
  },
  {
    title: '数量',
    width: 100,
    dataIndex: 'qty'
  },
  {
    title: '单位',
    width: 100,
    dataIndex: 'purchasingUnitValue'
  },
  {
    title: '要求货期',
    width: 200,
    dataIndex: 'limitDate'
  },
  {
    title: '价格',
    width: 100,
    dataIndex: 'price'
  },
  {
    title: '税率',
    width: 100,
    dataIndex: 'taxRate'
  },
  {
    title: '金额',
    width: 100,
    dataIndex: 'totalAmount'
  },
  {
    title: '状态',
    width: 100,
    dataIndex: 'status',
    scopedSlots: { customRender: 'status' }

  },
  {
    title: '备注',
    width: 200,
    dataIndex: 'remark'
  },
  
  
  {
    title: '退回原因',
    width: 200,
    dataIndex: 'rejectReason'
  },
  {
    title: '操作',
    width: 130,
    fixed: 'right',
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  components: {
  },
  data() {
    return {
      urlKey: 'basemgt-material/',
      columns,
      bag: {},
      // statusList:[{value:10,name:'草稿'},{value:20,name:'待开发审核'},{value:30,name:'待业务审核'},{value:40,name:'业务已审核'},{value:50,name:'退回草稿'},{value:60,name:'无效'}],
      statusList:[{value:10,name:'草稿'},{value:50,name:'退回草稿'},{value:70,name:'强制作废'}],
      form: this.$form.createForm(this),
      showAdd: false,
      visibleImgs: false,
      goToIndex: 0,
      imgList: [],
      account: '',
      groupName: '',
      toggleSearchStatus: false,
      loading: false,
      dataSource: [],
      prevImageUrl: [],
      auth: [],
      pagination: {
        total: 0,
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '30', '40'],
        showQuickJumper: true,
        showSizeChanger: true,
        showTotal: total => `共 ${total} 条记录`,
        itemRender: (current, type, originalElement) => {
          if (type === 'prev') {
            return <a>上一页</a>
          } else if (type === 'next') {
            return <a>下一页</a>
          }
          return originalElement
        }
      },
      classifyBigList: [],
      classifySmallList: [],
      classifyLittleList: [],
      classifyMinimumList: [],
      putGoodsSeasonList: [],
      zipperClothBagList: [],
      typeList: [],
      zipperHead: [],
      zipperModelJs: [],
      zipperSpecialExplain: [],
      zipperTooth: [],
      formContent: {
        accRetrievalSampleId:'',
        accRetrievalSampleCode:'',
        accClassifyBig:undefined,
        accCode:'',
        statusList:[10,50,70]
      },
    }
  },
  computed: {
    jobNumber() {
      return this.$store.getters.userInfo.workNo || ''
    }
  },
  mounted() {
    this.loadData()
    this.getAuth()
  },

  methods: {
    close() {
      this.showAdd = false
      this.loadData()
    },
    add(record) {
      if (record) {
        this.$router.push({ path: '/material/retrievalsample/create', query: { accRetrievalSampleId: record.accRetrievalSampleId } })
      } else {
        this.$router.push({ path: '/material/retrievalsample/create' })
      }
    },
    handleTableChange(pagination) {
      this.pagination = pagination
      this.loadData()
    },
    handleSubmit(e) {
      e.preventDefault()
      this.getList(1)
    },
    edit(record) {
      this.$router.push({ path: '/material/add', query: { accId: record.accId } })
    },
    loadData() {
      // this.getDictChildList('CLASSIFY_BIG', 'classifyBigList')
      // this.getDictChildList('CLASSIFY_SMALL', 'classifySmallList')
      this.getList()
    },
    async getDictChildList(name, list) {
      const params = {
        name: name
      }
      try {
        const res = await getDictChildList(params)
        if (res.code == 200) {
          this[list] = res.data
        } else {
          if (res.msg) {
            this.$message.error(res.msg)
          } else {
            this.$message.error('获取数据字典失败！')
          }
        }
      } catch (error) {
        this.$message.error('获取数据字典失败！')
      }
    },
    getAuth() {
      const params = {
        pageCode: 'acc_r_s_apply_list',
        jobNumber: this.jobNumber
      }
      postAction(`${this.urlKey}account/auth`, params).then(res => {
        if (res.code == 200) {
          this.auth = res.data
        }
      })
    },
    async getList(key) {
      this.loading = true
      const params = this.formContent
      params.current = this.pagination.current
      params.size = this.pagination.pageSize
      if (key) {
        params.current = 1
      }
      try {
        const res = await retrievalsample(params)
        if (res.code == 200) {
          this.dataSource = res.data.records
          this.pagination.total = res.data.total
        } else {
          this.$message.warning(res.msg)
        }
      } catch (error) {
        this.$message.warning('获取列表失败！')
      } finally {
        this.loading = false
      }
    },
    async deleteRecord(record) {
      const res = await retrievalsampleDelete({ accRetrievalSampleDetailId: record.accRetrievalSampleDetailId,jobNumber:this.jobNumber })
      if (res.code == 200) {
        this.$message.success('删除成功！')
        this.loadData()
      } else {
        this.$message.warning(res.msg)
      }
    },
    async doOperation(record, operate) {
      let params = {
        accId: record.accId,
        jobNumber: this.jobNumber,
        operate: operate
      }
      const res = await operation(params)
      if (res.code == 200) {
        this.$message.success('状态更新成功！')
        this.loadData()
      } else {
        this.$message.warning(res.msg)
      }
    }
  }
}
</script>
  <style lang="less" scoped>
.background {
  background: transparent;
}

.mr-10 {
  margin-left: 10px;
}
</style>